<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>购物篮</title>
		<link rel="stylesheet" type="text/css" href="css/shopping.css">
		<link rel="stylesheet" href="layui/css/layui.css" media="all" />
		<script src="layui/layui.all.js"></script>
		<script src="jq/jquery-3.1.1.min.js"></script>
	</head>
	

	<body>
		<!---head--------->
		<div class="header">
			<div class="box">
				<div class="title">
					<img class="images01" src="images/logo01.jpg" alt="这是一张图片">
					<a href="index.html">
						<div>琴行首页</div>
					</a>
					<a href="user.html">
						<p><span id="userName"></span></p>
					</a>
					<!--<a href="#">
						<p>消息</p>
					</a>-->
					<a href="orders.html">
						<p><img src="images/logo02.jpg">我的订单</p>
					</a>
					<a href="shopping.html">
						<p><img src="images/logo03.jpg">收藏篮</p>
					</a>
				</div>
			</div>
			<div class="logoCon">
				<img src="images/logo.jpg" alt="这是一张图片">
				
			</div>
			
			<div class="words02">
				
				<p>收藏篮商品信息</p>
				
			</div>
			<div class="img">
				<div class="images">
					
					<!--<div class="pic01">
						<input class="dot" name="" type="checkbox" value="">
						<img src="images/images80.jpg" alt="这是一张图片">
						<a href="product.html"><span>女中长款休闲宽松大码连帽长袖白色薄外套</span></a>
						<h1>颜色：白色</h1>
						<h2>尺码：M</h2>
						<h3>￥125.00</h3>
						<h4>￥125.00</h4>
						<p>删除</p>
					</div>-->
					
					<!--<div class="pic02">
						<input class="dot" name="" type="checkbox" value="">
						<img src="images/images81.jpg" alt="这是一张图片">
						<a href="product.html"><span>新款韩版单排扣翻领百搭宽松牛仔外套</span></a>
						<h1>颜色：蓝色</h1>
						<h2>尺码：M</h2>
						<h3>￥149.00</h3>
						<div class="num_down">-</div>
						<input name="1" type="tel" value="1">
						<div class="num_up">+</div>
						<h4>￥149.00</h4>
						<p>删除</p>
					</div>
					
					<div class="pic03">
						<input class="dot" name="" type="checkbox" value="">
						<img src="images/images82.jpg" alt="这是一张图片">
						<a href="product.html"><span>欧美范秋冬新款侧拉链厚底粗跟高跟短靴</span></a>
						<h1>颜色：黑色</h1>
						<h2>尺码：37</h2>
						<h3>￥249.00</h3>
						<div class="num_down">-</div>
						<input name="1" type="tel" value="1">
						<div class="num_up">+</div>
						<h4>￥249.00</h4>
						<p>删除</p>
					</div>-->
				</div>
			</div>
			<div class="words03">
				
				<h1>共有<span id="count1"></span>件商品</h1>
				
			</div>
			<!---foot-------->
			<div class="footer01">
				<div class="footerBox">
					<img src="images/logo.jpg" alt="这是一张图片">
					<div class="footerCon01">
						<ul class="foot01">
							<li>
								<a href="#"><span>公司</span></a>
							</li>
							<li>
								<a href="#">关于我们</a>
							</li>
							<li>
								<a href="#">招聘信息</a>
							</li>
							<li>
								<a href="#">联系我们</a>
							</li>
						</ul>
					</div>
					<div class="footerCon02">
						<ul class="foot02">
							<li>
								<a href="#"><span>消费者</span></a>
							</li>
							<li>
								<a href="#">消费者服务</a>
							</li>
							<li>
								<a href="#">意见反馈</a>
							</li>
							<li>
								<a href="#">手机版下载</a>
							</li>
						</ul>
					</div>
					<div class="footerCon03">
						<ul class="foot03">
							<li>
								<a href="#"><span>支付方式</span></a>
							</li>
							<li>
								<a href="#">快捷支付</a>
							</li>
							<li>
								<a href="#">银联支付</a>
							</li>
							<li>
								<a href="#">微信支付</a>
							</li>
						</ul>
					</div>
					<div class="footerCon04">
						<ul class="foot04">
							<li>
								<a href="#"><span>商家服务</span></a>
							</li>
							<li>
								<a href="#">商家入驻</a>
							</li>
							<li>
								<a href="#">商家中心</a>
							</li>
							<li>
								<a href="#">运营服务</a>
							</li>
						</ul>
					</div>
					<div class="footerCon05">
						<ul class="foot05">
							<li>
								<a href="#"><span>手机商城</span></a>
							</li>
						</ul>
						<div class="erWeiMa"></div>
						 
					</div>
				</div>
			</div>
			<div class="footer02">
				<p>营业执照注册号：330106000129004 增值电信业务经营许可证：鲁B2-20110349 网络文化经营许可证：鲁网文（2016）0349-219号 安全责任书 鲁公网安备 33010602002329号——林杨工作室</p>
			</div>
	</body>
<script type="text/javascript">
layui.use(['element', 'layer', 'upload', 'form'], function() {
		var upload = layui.upload
		layer = parent.layer === undefined ? layui.layer : top.layer,
		form = layui.form,
		element = layui.element,
		$ = layui.jquery;
		form.render();
	
	
	var userid = sessionStorage.getItem("userid");
	//layer.msg(userid);
	
	$("#userName").text(sessionStorage.getItem("userName"));
	
	
	$.ajax({
			type:"get",
			url:"http://127.0.0.1/yh/selectAllShoppingCart",
			async:false,
			data:{"userid":userid},
			dataType:"json",
			success:function(data){
				if(data.code==0){
					$("#count1").text(data.data.length);
					var str = "";
					for (var i = 0; i < data.data.length; i++) {
						str += '<div class="pic01">'+
									'<img src="'+data.data[i].guitarphoto+'" alt="这是一张图片">'+
									'<a href="#"><span>'+data.data[i].guitarname.substring(0,4)+'...&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></a>'+
									'<h1>颜色：'+data.data[i].color+'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h1>'+
									'<h4>￥'+data.data[i].price+'.00</h4>'+
									'<p id="delete" carid="'+data.data[i].id+'">删除</p>'+
									'<p id="fukuan" guitarname="'+data.data[i].guitarname+'" guitarid="'+data.data[i].guitarid+'" goodsType="'+data.data[i].goodsType+'" color="'+data.data[i].color+'" count="'+data.data[i].count+'" guitarphoto="'+data.data[i].guitarphoto+'" prace="'+data.data[i].price+'">付款</p>'+
								'</div>'
					}
					$(".images").html(str);
				}
			}
		});	
	
	
	var guitarname = $("#fukuan").attr('guitarname');
	var id= 0;
	$.ajax({
			type:"get",
			url:"http://127.0.0.1/yh/selectOneGuitarInfoByName",
			async:false,
			data:{"name":guitarname},
			dataType:"json",
			success:function(data){
				if(data.code==0){
				id = data.data.id;
				}
			}
		});
	
	
	
	
	
	
	
	//删除收藏的方法
	$(".images").delegate("#delete","click",function(){
		//alert("点到删除了")
		var carid = $("#delete").attr('carid');
		$.ajax({
			type:"get",
			url:"http://127.0.0.1/yh/deleteShoppingCartById",
			async:false,
			data:{"id":carid},
			dataType:"json",
			success:function(data){
				if(data.code==0){
				layer.msg(data.msg, {
 							icon: 1,
  							time: 2000 //2秒关闭（如果不配置，默认是3秒）
							}, function(){
  								//刷新页面
							location.reload();
							}); 
					
				}
			}
		});
	})
	
	//付款的方法
	
	$(".images").delegate("#fukuan","click",function(){
		//alert("点到付款了")
		var guitarname = $("#fukuan").attr('guitarname');
		var guitarid = $("#fukuan").attr('guitarid');
		var goodsType = $("#fukuan").attr('goodsType');
		var color = $("#fukuan").attr('color');
		var count = $("#fukuan").attr('count');
		var guitarphoto = $("#fukuan").attr('guitarphoto');
		var prace = $("#fukuan").attr('prace');
		
		
		$.ajax({
			type:"post",
			url:"http://127.0.0.1/yh/insertOrderInfo",
			async:true,
			data:{
				"userid":userid,
				"guitarname":guitarname,
				"guitarid":guitarid,
				"prace":prace,
				"count":count,
				"guitarphoto":guitarphoto,
				"color":color,
				"goodsType":goodsType
			},
			dataType:"json",
			success:function(data){
				if(data.code==0){
					//id商品id+那个表+数量
					window.location.href="pay.html?id="+id+"="+0+"="+count+"="+data.data+"=";
				}else{
					alert(data.msg);
				}
			}
		});
		
		
	})
	
	
})
</script>
</html>